var index = 0;

function navClick(liName,divName){
    index++;
    if (index % 2 == 1) {
        $(`.${divName}`).css({
            display: 'flex',
        });
        $(`.${liName}`).css({
            color:'#ff8a00'
        });
        $(`.${liName} span`).css({
            borderBottom: '0.05rem solid #ff8a00',
            borderTop:'none'
        })
    } else if (index % 2 == 0) {
        $(`.${divName}`).css({
            display: 'none',
        })
        $(`.${liName}`).css({
            color:'#666'
        });
        $(`.${liName} span`).css({
            borderTop: '0.05rem solid #ccc',
            borderBottom:'none'
        })
    }
}
$('.btnArea').tap(function () {
    navClick('btnArea','area')
})
$('.btnPrice').tap(function () {
    navClick('btnPrice','price')
})
$('.btnHouse').tap(function () {
    navClick('btnHouse','house')
})
$('.btnMore').tap(function () {
    navClick('btnMore','more')
})

// const lis=$('.nav-ul li');
// console.log(lis);
// for(let i=0;i<lis.length;i++){
//     lis[i].className+='arrowcurrent';
//     for(let i=0;i<lis.length;i++){
//         lis[i].className=''
//     }
// }

